<template>
  <div>
    <el-form ref="editFormRef" :style="{ width: '50%' }" :model="formData" :rules="rules" :label-width="'250px'">
      <el-form-item label="是否开启评论/留言板" prop="openCommentType">
        <div>
          <el-radio-group v-model="formData.openCommentType">
            <el-radio :label="1">是</el-radio>
            <el-radio :label="0">否</el-radio>
          </el-radio-group>
        </div>
      </el-form-item>
      <template v-if="formData.openCommentType == 1">
        <el-form-item label="畅言appId" prop="changyanAppId">
          <el-input :maxLength="50" v-model="formData.changyanAppId" />
        </el-form-item>
        <el-form-item label="畅言appKey" prop="changyanAppKey">
          <el-input :maxLength="50" v-model="formData.changyanAppKey" />
        </el-form-item>
      </template>
      <el-form-item label="是否开启Git Pages" prop="gitPagesType">
        <div>
          <el-radio-group v-model="formData.gitPagesType">
            <el-radio :label="1">是</el-radio>
            <el-radio :label="0">否</el-radio>
          </el-radio-group>
        </div>
      </el-form-item>
      <el-form-item label="是否开启公安备案和ICP备案信息" prop="showIcp">
        <el-radio-group v-model="formData.showIcp">
          <el-radio :label="1">是</el-radio>
          <el-radio :label="0">否</el-radio>
        </el-radio-group>
      </el-form-item>
      <template v-if="formData.showIcp == 1">
        <el-form-item label="ICP备案域名" prop="icpDomain">
          <el-input :maxLength="100" v-model="formData.icpDomain" />
        </el-form-item>
        <el-form-item label="ICP备案号" prop="icpNo">
          <el-input :maxLength="100" v-model="formData.icpNo" />
        </el-form-item>
        <el-form-item label="公安备案省份" prop="policeProvince">
          <el-select v-model="formData.policeProvince" clearable showSearch>
            <el-option v-for="(item, index) in provinceList" :label="item" value="item" :key="index">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="公安备案号" prop="policeNo">
          <el-input :maxLength="100" v-model="formData.policeNo" />
        </el-form-item>
      </template>
      <el-form-item label="下载静态页面">
        <div>
          <a href="javascript:void(0)" @click="createZip()" class="a-link">点击下载</a>
        </div>
      </el-form-item>
      <el-form-item>
        <el-button type="danger" @click="submitForm">保存</el-button>
      </el-form-item>
    </el-form>

  </div>
</template>

<script setup>

import { ref, getCurrentInstance, reactive } from 'vue'
const { proxy } = getCurrentInstance();

const api = {
  'getSysSetting': "sysSetting/getSysSetting",
  'saveSysSetting': "sysSetting/saveSysSetting",
  'createZip': "sysSetting/createZip"
};

const formData = reactive({})

const provinceList = ["京", "冀", "晋", "蒙", "辽", "吉", "黑", "沪", "苏", "浙", "皖", "闽", "赣", "鲁", "豫", "鄂", "湘", "粤", "桂", "琼", "渝", "川", "黔", "滇", "藏", "陕", "甘", "青", "宁", "新", "台", "港", "澳"];
const rules = {
  openCommentType: [
    { required: true, message: "是否开启评论不能为空" }
  ],
  changyanAppId: [
    { required: true, message: "畅言appId不能为空" }
  ],
  changyanAppKey: [
    { required: true, message: "畅言appkey不能为空" }
  ],
  gitPagesType: [
    { required: true, message: "是否开启Git Pages不能为空" }
  ],
  showIcp: [
    { required: true, message: "是否开启公安备案和IcP备案信息不能为空" }
  ],
  icpDomain: [
    { required: true, message: "ICP备案域名不能为空" }
  ],
  icpNo: [
    { required: true, message: "ICP备案号不能为空" }
  ],
  policeProvince: [
    { required: true, message: "公安备案省份不能为空" }
  ],
  policeNo: [
    { required: true, message: "公安备案号不能为空" }
  ]
};

const getSysSetting = async () => {
  let result = await proxy.Request({
    url: api.getSysSetting
  });
  if (result!= null) {
    Object.assign(formData, result.data);
  }
};
getSysSetting();



const editFormRef = ref();

const submitForm = () => {
  return editFormRef.value.validate(async (valid) => {
    if (!valid) {
      return false;
    }
    let params = {};
    Object.assign(params, formData);
    let result = await proxy.Request({
      url: api.saveSysSetting,
      params: params
    });
    if (!result) {
      return;
    }
    proxy.Message.success('保存成功');
  });
};

const createZip = async () => {
  let result = await proxy.Request({
    url: api.createZip
  });
  if (!result) {
    return;
  }
  document.location.href = "/api/file/download/" + result.data + "/" + encodeURI('静态页面.zip');
};


</script>

<style lang='scss'></style>